<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>

        <h:body onload="dlg.show()"  >

            <p:growl id="growl" showDetail="true" life="2000" />

            <p:dialog id="dialog" header="" modal="true" showEffect="explode"  height="200" widgetVar="dlg">
                <h:form onmousemove="dlg.show()" >
                        <h:panelGrid columns="2" cellpadding="3" style="display: block;
                                     margin-left: auto;
                                     margin-right: auto" >

                            <h:outputLabel for="username" value="Login: *" />
                            <h:inputText value="#{loginJsfBean.username}"
                                         id="username" required="true" label="username" />

                            <h:outputLabel for="password" value="Senha: *"/>
                            <p:keyboard id="password" required="true" value="#{loginJsfBean.senha}" clearLabel="Limpar" closeLabel="Fechar" label="Teclado virtual" lang="br" password="true"/>


                            <f:facet name="footer">
                                <p:commandButton   value="Entrar"  action="#{loginJsfBean.doLogin}" update="growl"
                                                   oncomplete="handleLoginRequest(xhr, status, args)"/>
                            </f:facet>

                        </h:panelGrid>

                </h:form>
            </p:dialog>

            <h:graphicImage  id="carImage" url="/resources/img/comercio-exterior-1.jpg" alt="MyImagem"

                             style="display: block;
                             margin-left: auto;
                             margin: auto;
                             margin-right: auto" />



            <script type="text/javascript">
               function handleLoginRequest(xhr, status, args) {
                   if(args.validationFailed || !args.loggedIn) {
                        jQuery('#dialog').effect("shake", { times:3 }, 100);
                    } else {
                        dlg.hide();
                       jQuery('#loginLink').fadeOut();
                    }
                }
            </script>

        </h:body>
    </h:head>
</html>

